<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Products Grid Left Sidebar</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.png" />
<link
	href="https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i&display=swap"
	rel="stylesheet">
<link
	href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i&display=swap"
	rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/slick.css">
<link rel="stylesheet" href="css/chosen.min.css">
<link rel="stylesheet" href="css/pe-icon-7-stroke.css">
<link rel="stylesheet" href="css/magnific-popup.min.css">
<link rel="stylesheet" href="css/lightbox.min.css">
<link rel="stylesheet" href="js/fancybox/source/jquery.fancybox.css">
<link rel="stylesheet" href="css/jquery.scrollbar.min.css">
<link rel="stylesheet" href="css/mobile-menu.css">
<link rel="stylesheet" href="fonts/flaticon/flaticon.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/jquery.plugin-countdown.min.js"></script>
<script src="js/jquery-countdown.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/magnific-popup.min.js"></script>
<script src="js/isotope.min.js"></script>
<script src="js/jquery.scrollbar.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/mobile-menu.js"></script>
<script src="js/chosen.min.js"></script>
<script src="js/slick.js"></script>
<script src="js/jquery.elevateZoom.min.js"></script>
<script src="js/jquery.actual.min.js"></script>
<script src="js/fancybox/source/jquery.fancybox.js"></script>
<script src="js/lightbox.min.js"></script>
<script src="js/owl.thumbs.min.js"></script>
<script src="js/jquery.scrollbar.min.js"></script>
<script src='https://ditu.google.cn/maps/api/js?key=AIzaSyC3nDHy1dARR-Pa_2jjPCjvsOR4bcILYsM'></script>
<script src="js/frontend-plugin.js"></script>
</head>
<body class="productsgrid-page">

	<!-- 引入头部导航栏 -->
	<jsp:include page="top.jsp"></jsp:include>

	<div class="main-content main-content-product left-sidebar">
		<div class="container">
			<div class="row">
				<div class="col-lg-12">
					<div class="breadcrumb-trail breadcrumbs">
						<ul class="trail-items breadcrumb">
							<li class="trail-item trail-begin"><a href="index.jsp">首页</a>
							</li>
							<li class="trail-item trail-end active"><a href="index.jsp">商城</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<div class="row">
				<div
					class="content-area shop-grid-content no-banner col-lg-9 col-md-9 col-sm-12 col-xs-12">
					<div class="site-main">

						<ul class="row list-products auto-clear equal-container product-grid" id="order">
							<li class="product-item  col-lg-4 col-md-6 col-sm-6 col-xs-6 col-ts-12 style-1">
								<h3>欢迎来到个人中心。</h3>
							</li>
						</ul>
						
					</div>
				</div>
				<div class="sidebar col-lg-3 col-md-3 col-sm-12 col-xs-12">
					<div class="wrapper-sidebar shop-sidebar">
						<div class="widget woof_Widget">
							<div class="widget widget-categories">
								<h3 class="widgettitle">我的订单</h3>
								<ul class="tagcloud">
									<li class="tag-cloud-link">
										<a onclick="selectOrder(1)">
										<button  class="button btn-cart-to-checkout">
                                		未支付
                                		</button></a>
                                			<br>
                                	</li>
                                	<br><br>
									<li class="tag-cloud-link">
										<a onclick="selectOrder(2)">
										<button  class="button btn-cart-to-checkout">
                                		待发货
                                		</button></a>
									</li>
									<br><br>
									<li class="tag-cloud-link">
										<a onclick="selectOrder(3)">
										<button  class="button btn-cart-to-checkout">
                                		待收货
                                		</button></a>
									</li>
									<br><br>
									<li class="tag-cloud-link">
										<a onclick="selectOrder(4)">
										<button  class="button btn-cart-to-checkout">
                                		待评价
                                		</button></a>
                                		
									</li>
									<br><br>
									<li class="tag-cloud-link">
										<a onclick="selectOrder(5)">
										<button  class="button btn-cart-to-checkout">
                                		已评价
                                		</button></a>
									</li>
									<br><br>
								</ul>
							</div>
							<div class="widget widget_filter_price">
								<h4 class="widgettitle">地址管理</h4>
								<ul class="tagcloud">
									<li class="tag-cloud-link">
										<a onclick="selectOrder(1)">
										<button  class="button btn-cart-to-checkout">
                                		我的地址
                                		</button></a>
                                			<br>
                                	</li>
								</ul>

							</div>
							
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

<!-- 引入页脚栏 -->
	<jsp:include page="footer.jsp"></jsp:include>
	<script type="text/javascript">
	
	function shopping(pdtId){
		window.location.href="productdetails-fullwidth.jsp?pdtId="+pdtId;
	}
	
	function selectOrder(msg){
		var state;
		if(msg==1){
			state="未支付";
		}else if(msg==2){
			state="待发货";
		}else if(msg==3){
			state="待收货";
		}else if(msg==4){
			state="待评价";
		}else if(msg==5){
			state="已评价";
		}
		//获取产品类别
		$.post("http://localhost:8080/Greenleaf/order/getOrdetByState",
				{"state" : state},
				function(res) {
				  if (res.count) {
					  document.getElementById("order").innerHTML="";
					 var html = "";
					$.each(res.data,function(index, item) {
						var orderState=""
						if(item.paymentState=='未支付'){
							orderState="未支付";
						}else{
							if(item.masterState=='待发货'){
								orderState="待发货";
							}else if(item.masterState=='待收货'){
								orderState="待收货";
							}else if(item.masterState=='待评价'){
								orderState="待评价";
							}else if(item.masterState=='已评价'){
								orderState="已评价";
							}
						}
						
						html+='<li> <h4>一片綠葉公司</h4> 订单号：<span >'+item.orderNumber+'</span>&emsp;&emsp;&emsp;&emsp;&emsp; 状态：<span >'+orderState+'</span><br><br>下单时间：<span>'+item.orderTime+'</span>&emsp;&emsp;&emsp;&emsp;&emsp;总价：<span>'+item.total+'</span>元<br><br><a id="button" onclick="dleOrder('+item.orderId+')"><button  class="button btn-cart-to-checkout">取消订单</button></a><br><br><br><br></li>'
						
						
					
						document.getElementById("order").innerHTML=html;
						if(orderState=="已评价"){
							document.getElementById("button").innerHTML="";
						}
					});
				} else {
					document.getElementById("order").innerHTML='<li class="product-item  col-lg-4 col-md-6 col-sm-6 col-xs-6 col-ts-12 style-1"><h3>暂无订单</h3></li>';
				}
				 
			}, "json");
		
	}
	
	function dleOrder(orderId){
		$.post("http://localhost:8080/Greenleaf/order/del",
				{"orderId" : orderId},
				  function(res){
				    if(res){
				      layer.msg("取消成功！");
				      location.reload();
				    }else{
				       layer.msg("取消失败,请稍后重试！");
				    }
				  },"json");
	}
	</script>


</body>

</html>